<?php
session_start();

require "connect.php";



//$usr="aaax";
//$pass="ppp";


if (isset($_POST['username'])) {

    $username = htmlentities($_POST['username'], ENT_QUOTES);
    $password = htmlentities($_POST['password'], ENT_QUOTES);


    $query = "SELECT * FROM users WHERE username='" . $username . "' AND password='" . $password . "'";

    $result = $db->query($query);

    $res = $result->fetchAll();

    //var_dump($res);
    //die();

    if (count($res) > 0) {

        $_SESSION['loggedin'] = "yes";
        $_SESSION['username'] = $username;
        $_SESSION['id'] = $res[0]['id'];
        header("Location: index.php");
    } else {

        echo "<script type='text/javascript'>alert('Invalid username or password, please Try again!');</script>";
    }
}
require "header.php";
?>
<body onload="checkload()" onresize="resi()">

    <div class="head">
        <img src="images/head.jpg" height="40px" width="100%"><img src="images/logo.png" class="logo" id="small_logo"></img>
    </div>







    <img class="main_logo" id="main_logo" src="images/logo/radt_main_login_logo.png" />
    <div class="inbtn"  onclick="displogin()">
        <img src="images/in_btn_down.png" id="inbtn_image" height="15px" width="50px">
    </div>
    <div class="loginplate" id="plate"> 
        <img src="images/loginplate.jpg" height="500px" width="300px" id="plate" style="visibility:visible">

        <form method="POST" action="login.php">
            <table class="tablelogin">
                <tr>
                    <td class="white">
                        username: </td><td><input type="text" name="username" id="user_name"/>
                    </td>
                </tr>
                <tr>
                    <td class="white">Password:</td> <td><input type="password" name="password" />
                    </td>
                </tr>

                <tr>
                    <td>
                    </td>
                    <td>

                        <input type='image' src='images/login_button.png' height=40>

                    </td>
                </tr>
            </table>
        </form>
    </div>

    <div  id="logos" class="logos">
            <img src="images/logo/linux.png"  class="logosimg"/>
            <img src="images/logo/apache.png"  class="logosimg" />
            <img src="images/logo/php.png"  class="logosimg" />
            <img src="images/logo/jquery.png"  class="logosimg" />    
            <img src="images/logo/mysql.png"  class="logosimg" />
            <img src="images/logo/python.png"  class="logosimg" />    


        
    </div>
    <div class="foot" ></div>
    <script type="text/javascript">
        var hide=true;


        function resi()
        {
    
            //alert("resizing");
            var winw=window.innerWidth;
            var winh= window.innerHeight;
            console.log(winw);
   
            if(winw > "400")
            {
                document.getElementById("main_logo").style.width="250px";
                document.getElementById("main_logo").style.marginLeft="-125px"; 
            
            }
            else if(winw > "200")
            {
                document.getElementById("main_logo").style.width="200px";
                document.getElementById("main_logo").style.marginLeft="-100px"; 
            }
            if(winw < "200")
            {
                document.getElementById("main_logo").style.width="100px";
                document.getElementById("main_logo").style.marginLeft="-50px"; 
            }
            
           
            
    
        }


        function checkload()
        {
            if(window.onload)
                {
            load();
            
                }
                else
                    {
                        setTimeout('checkLoad();', 1000);
                        
                    }
        }














        function load()
        {
    
            var winw=window.innerWidth;
            var winh= window.innerHeight;
            //alert("width :"+winw+""+"height :"+winh);
    
            if(winw <= "400")
            {
                $('.logosimg').hide();
                document.getElementById("main_logo").style.width="200px";
                document.getElementById("main_logo").style.marginLeft="-100px";
             
            }
            if(winw <= "200")
            {
                $('.logosimg').hide();
                document.getElementById("main_logo").style.width="100px";
                document.getElementById("main_logo").style.marginLeft="-50px";
             
            }
    
    
    
    
           
            $('#main_logo').addClass('animated flip');
            $('#small_logo').show('slide',1000);
            $('.logos').show('slide',1000);
                
    
        }
        





        function displogin(){
            if(hide==true){	
                //$('#plate').slideDown();
                if( !$("#plate, .main_logo, #logos").is(":animated") ) {

                    $('#plate').show('bounce',{times:3},350);
                    $('.main_logo').hide('scale',200);
                    $('#logos').hide('slide',200);
                    document.getElementById('inbtn_image').src="images/in_btn_up.png";
                                               
                    hide=false;
                }         
            }
            else{
                if( !$("#plate, .main_logo, #logos").is(":animated") ) {
		
                    $('#plate').slideUp();
                      $('#main_logo').removeClass('animated flip');
                    $('.main_logo').show('scale',1000);
                    $('#logos').show('slide',1000);
                    document.getElementById('inbtn_image').src="images/in_btn_down.png";
                    hide=true;
                }
            }
        }


    </script>

<?php
require "footer.php";
?>
